<!-- HTML5文件 -->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
		<meta name="format-detection" content="telephone=no">
		<title>html title</title>

		<link rel="stylesheet" href="../assets/agile/css/agile.layout.css">
		<link rel="stylesheet" href="../assets/third/seedsui/plugin/seedsui/seedsui.min.css">
		<link rel="stylesheet" href="../assets/third/seedsui/plugin/animate/animate.css">
		<style>
			.titlebar,.tab.active{
				background-color:#18B2ED;
			}
			.titlebar h1,.tab.active label{
				font-weight:bold;
				color:white;
			}
			.titlebar a i,.titlebar a label{
				color:white;
			}
			.art_mid{
				top:45px;
				bottom:40px
			}
			
		</style>
	</head>
	<body>
		<div id="section_container">
		 <section id="sectionid" data-role="section" class="active">
		 	<header>
		 		<div class="titlebar" >
		 			<h1 class="text-center ">在uixml中运行有效</h2>
		 		</div>
		 	</header>
		 	<article id="article_main" data-role="article" data-transition="slide"  class="active art_mid" >
		 		<span id="DirectAjax" class="button block bg-6" style="margin:5px">DirectAjax</span>
		 		<span id="serverAjax" class="button block bg-1" style="margin:5px">serverAjax</span>
		 		<span id="DirectFormSubmit" class="button block bg-2" style="margin:5px">DirectFormSubmit</span>
		 		<span id="serverFormSubmit" class="button block bg-3" style="margin:5px">serverFormSubmit</span>
		 		<div id="recal"></div>
		 	</article>
		 	<article id="article_serv"  data-role="article" data-transition="slide" data-scroll="verticle" class="art_mid" >
		 		<div class="scroller">
		 			pageserv
		 		</div>
		 	</article>
		 	<article id="article_conf" data-role="article" data-transition="slide" data-scroll="verticle" class="art_mid" >
		 		<div class="scroller">
		 			pageconfig
		 		</div>
		 	</article>
		 	<footer>
				<ul class="menubar" style="line-height: 40px;">
					<li class="tab active" data-role="tab" href="#article_main" data-toggle="article">
						<label class="text-center">首页</label>
					</li>
					<li class="tab " data-role="tab"  href="#article_serv" data-toggle="article">
						<label class="text-center">服务</label>
					</li>
					<li class="tab " data-role="tab"  href="#article_conf" data-toggle="article">
						<label class="text-center">设置</label>
					</li>
				</ul>
		 	</footer>
		 </section>
		</div>
		<script src="../assets/third/amd/require.js" ></script>
		<script src="../assets/app/js/app.require.js"></script>
		<script src="../json/jsondata.js"></script>
		<script>
		 var bridgeOk  = false;
         document.addEventListener("plusready", onPlusReady, false);
         function onPlusReady() {//可以写原生能力的方法
         	bridgeOk = true;
         }
         //调用原生的ajax需要将回调变量定义在require外层
         var successFunction ;
         var failFunction ;
         
		 require(['vue','agile'],function(Vue){
		 	$('#DirectAjax').on('click',function(){
		 		if (bridgeOk){
		 			//当服务端集成在本工程中，可以通过ClientUtil获取到服务的地址
		 			var settingInfo = ClientUtil.getSetting();
		 			var path= "http://"+settingInfo.ip+":"+settingInfo.port+"/process/service/"+ClientUtil.getAppId()+"/";
		 			//当服务端在别的服务工程中，就只能写好外侧服务接口的地址
		 			//path = "http://172.16.4.74:8001/process/service/myfirst/"
		 			
		 			var ajaxData = {}
		 			ajaxData.method = "GET";   
                    ajaxData.isBlock = true;
                    ajaxData.url = path+"hellow";
                    ajaxData.successFunction = "successFunction";
                    ajaxData.failFunction = "failFunction";
                    var ajax = new DirectAjax(ajaxData);
                    ajax.send();
		 		}
		 	})
		 	
		 	
		 	//走本工程服务路由的调用
		 	$('#serverAjax').on('click',function(){
		 		if (bridgeOk){
		 			var ajaxData = {}
		 			ajaxData.method = "GET";   
                    ajaxData.isBlock = true;
                    //只有在服务端与工程在一起的时候才能这样用
                    ajaxData.url = "hellow";
                    ajaxData.successFunction = "successFunction";
                    ajaxData.failFunction = "failFunction";
                    var ajax = new Ajax(ajaxData);
                    ajax.send();
		 		}
		 	})
		 	
		 	
		 	
		 	//第三方工程服务的提交
		 	$('#DirectFormSubmit').on('click',function(){
		 		if (bridgeOk){
		 			var ajaxData = {}
		 			ajaxData.method = "POST";   
                    ajaxData.isBlock = true;
                    ajaxData.url = "http://172.16.4.74:8001/process/service/myfirst//postSubmit4Gig";
                    ajaxData.successFunction = "successFunction";
                    ajaxData.failFunction = "failFunction";
                    //参数
                    //当json字符串太大以及层级太深，用file方式上传
                    var filepath = "sys:db/tempupload.txt"
                    if (FileUtil.writeFile(filepath,JSON.stringify(uploadJson))){
                       var params = new Array();
                       	var tempjson = {}
                       	tempjson.type=1
                       	tempjson.name="param"
                       	tempjson.value = filepath;
                       	params.push(tempjson);
                       ajaxData.data = params;
                       var ajax = new DirectFormSubmit(ajaxData);
                       ajax.send();
                    }
		 		}
		 	})
		 	
		 	//走路由的提交
		 	$('#serverFormSubmit').on('click',function(){
		 		if (bridgeOk){
		 			var ajaxData = {}
		 			ajaxData.method = "POST";   
                    ajaxData.isBlock = true;
                    //只有在服务端与工程在一起的时候才能这样写
                    ajaxData.url = "postSubmit";
                    ajaxData.successFunction = "successFunction";
                    ajaxData.failFunction = "failFunction";
                    var params = new Array();
                    var userid = {};
                    userid.type=0
                    userid.name="userid"
                    userid.value="lws"
                    params.push(userid);
                    var pwd = {};
                    pwd.type=0
                    pwd.name="pwd"
                    pwd.value="123456789"
                    params.push(pwd);
                    
                    
                    var tjson = {};
                    tjson.id="lws"
                    tjson.pwd="123"
                    var pwd2 = {};
                    pwd2.type=0
                    pwd2.name="json"
                    pwd2.value=JSON.stringify(tjson)
                    params.push(pwd2);
                    
                    
                    
                    ajaxData.data = params;
                    var ajax = new FormSubmit(ajaxData);
                    ajax.send();
		 		}
		 	})
		 	
		 	 successFunction = function(data){
		 		var json = eval("("+data.responseText+")");
		 		$('#recal').html(JSON.stringify(json));
		 	}
		 	
		 	 failFunction = function(data){
		 		alert('fail');
		 	}
		 });
		</script>
	</body>
</html>